import React from 'react';
import { DrawerForm } from '@ant-design/pro-form';
import { Form, Input, message } from 'antd';
import { useRequest } from 'ahooks';
import { apiRole } from '@/api/system/roles.api';

interface SystemEditRoleProps {
  role?: API.Role;
}

export const SystemEditRole = (props: SystemEditRoleProps) => {
  const { run: submitRequest } = useRequest(apiRole.editInfo, {
    manual: true,
    onSuccess: () => {
      message.success('保存成功');
      return true;
    },
  });
  // 提交表单
  const onFormSubmit = async (data: API.Role) => {
    submitRequest(data.id, data);
  };
  return (
    <DrawerForm
      title={'修改信息'}
      trigger={<a>编辑基本信息</a>}
      initialValues={props.role}
      onFinish={onFormSubmit}
    >
      <Form.Item label={'角色名称'} name={'name'} required={true}>
        <Input />
      </Form.Item>

      <Form.Item label={'备注'} name={'remark'}>
        <Input.TextArea />
      </Form.Item>
    </DrawerForm>
  );
};
